<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8" />
<title>写文章</title>
<link rel="stylesheet" href="../markdown/examples/css/style.css" />
<link rel="stylesheet" href="../markdown/css/editormd.min.css" />
<style>

.atitle {
	border: none;
}

.atitle {
	padding: 10px 20px 10px 10px;
	margin-bottom: 0;
	font-size: 30px;
	font-weight: normal;
	line-height: 30px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border-radius: 0;
	box-shadow: none;
	outline: none;
}

.button:hover {
    /*border: 2px solid #A6C8FF;*/
    color: #2DCB70;
    cursor:pointer;
}

.button {
	border: 2px solid #2DCB70;
	text-align:center;
    display: inline-block;
    width: 180px;
    height: 50px;
    line-height: 50px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -o-box-sizing: border-box;
    -moz-box-sizing: border-box;
    margin: 0 auto;
    font-weight: bold;
    font-size: 18px;
    text-decoration: none;
    text-transform: uppercase;
    font-family: Arial;
    -moz-transition: ease 0.4s;
    -o-transition: ease 0.4s;
    -webkit-transition: ease 0.4s;
    transition: ease 0.4s;
}
</style>
</head>
<body>
	<div id="layout">
		<header>
			<input class="atitle mousetrap" name="title" type="text" id="title"
				placeholder="无标题文章" />
				 <input type="text" class="atitle mousetrap category"
				placeholder="分类">
			<a id="submitBtn" class="button">发布文章</a>
		</header>
		<div id="test-editormd"></div>
	</div>
	<script src="../js/jquery-1.12.4.min.js"></script>
	<script src="../markdown/editormd.js"></script>
	<script type="text/javascript">
		var testEditor;
		$(function() {
			testEditor = editormd("test-editormd", {
				width : "90%",
				height : 720,
				path : '../markdown/lib/',
				//theme: "dark",
				//theme:"blue",
				//previewTheme : "dark",
				//editorTheme : "pastel-on-dark",
				codeFold : true,
				saveHTMLToTextarea : true, // 保存 HTML 到 Textarea
				searchReplace : true,
				htmlDecode : "style,script,iframe|on*", // 开启 HTML 标签解析，为了安全性，默认不开启
				emoji : true,
				taskList : true,
				tocm : true, // Using [TOCM]
				tex : true, // 开启科学公式TeX语言支持，默认关闭
				flowChart : true, // 开启流程图支持，默认关闭
				sequenceDiagram : true, // 开启时序/序列图支持，默认关闭
				imageUpload : true,
				imageFormats : [ "jpg", "jpeg", "gif", "png", "bmp", "webp" ],
				imageUploadURL : "../upload"
			});
		});
		$(document).ready(function() {
			var $submitBtn = document.getElementById('submitBtn');
			var $title = document.getElementsByClassName("atitle")[0];
			var $category = document.getElementsByClassName("category")[0];

			var submit = function() {
				console.log($title.value);
				console.log($category.value);
				console.log(testEditor.getMarkdown());

				$.ajax({
					url : "../add.do",
					type : "POST",
					data : {
						"title" : $title.value,
						"category" : $category.value,
						"mdtxt" : testEditor.getMarkdown(),
					},
					//dataType : "json",
					success : function(msg) {
						if (msg) {
							alert('发布成功');
							location.href = '../jump.do';
						}
					},
					error : function(er) {
						alert("发布失败")
						console.log(er);
					}
				});
			};
			$submitBtn.addEventListener("click", submit, false);
		})
	</script>
</body>
</html>